import {Link} from "react-router-dom"
import {useState} from "react"

import XSVg from "../../../components/svgs/X"

import {MdOutlineMail} from "react-icons/md"
import {FaUser} from "react-icons/fa"
import {MdPassword} from "react-icons/md"
import {MdDriveFileRenameOutline} from "react-icons/md"
import {useMutation, useQueryClient} from "@tanstack/react-query"
import toast from "react-hot-toast"


const SignUpPage = () => {
    const [formData, setFormData] = useState({
        email: "",
        username: "",
        fullName: "",
        password: "",
    })

    const queryClient = useQueryClient();

    const {mutate: isError, isPending, error} = useMutation({
        mutationFn: async ({email, username, fullName, password}) => {
            try {
                const res = await fetch("/api/auth/signup", {
                    method: "POST",
                    headers: {
                        "Content-Type": "applications/json",
                    },
                    body: JSON.stringify({email, username, fullName, password}),
                })

                const data = await res.json()
                if (!res.ok) {
                    throw new Error(data.error || "Failed to create account")
                }
                console.log(data)

                return data
            } catch(error) {
                console.error("Error in SignUpPage.jsx: ", error)
                throw error
            }
        },

        onSuccess: () => {
            toast.success("Account created successfully")
            queryClient.invalidateQueries({queryKey: ["authUser"]})
        },
    })

    const handleSubmit = (e) => {
        e.preventDefault()
        mutate(formData)
    }

    const handleInputChange = (e) => {
        setFormData({
            ...formData,
            [e.target.name]: e.target.value
        })
    }
    // TODO: fix this comp
    return (
        <div>
            
        </div>
    )
}

export default SignUpPage